<template>
   <ga-tag :color="color()">{{title}}</ga-tag>
</template>

<script setup>
import { defineEmits, defineProps } from 'vue'
const props = defineProps({
  // 标题
  title: {
    required: true,
    default: '其他'
  }
})
const color = () => {
  switch (props.title) {
    case '运行':
      return 'green'
      break
    case '异常':
      return 'red'
      break
    case '告警':
      return 'orange'
      break
    default:
      break
  }
}
</script>

<style lang='scss' scoped>
.garco-tag-size-medium{
  padding: 7px 18px;
  height: 26px;
  line-height: 26px;
}
</style>
